<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<%@ include file="../include/laypublic.jsp"%>
<!DOCTYPE html>
<html>
<head>
<title>会议室管理</title>
</head>
<script type="text/html" id="meeting-tr">
<tr id="MEETINGRow-{0}"  > 
<td>
<span class="label" >{0}</span>
<input type="hidden" value="{0}" name="roomCodes" />
</td> 
<td><input type="text" value="{1}" name="roomNames" lay-verify="required" autocomplete="off" class="layui-input roomName" /></td> 
<td><input type="text" value="{2}" name="holdNums" onblur="isNumberAndFloat(this);" lay-verify="required|intNumber" autocomplete="off" class="layui-input holdNum" /></td> 
<td class="tg-c" >
<button type="button" class="layui-btn layui-btn-sm del-row" ><i class="layui-icon">&#xe640;</i></button> 													
<button type="button" class="layui-btn layui-btn-sm add-row" ><i class="layui-icon">&#xe654;</i></button></td> 							
</tr>
</script>
<style>
.fieldset {
	margin-top: 5px;
	margin-bottom: 0px
}

.layui-legend {
	background-color: #5fb878;
	font-size: 15px !important;
	width: 140px;
}

.layui-form-item {
	margin-bottom: 5px;
	clear: both;
	*zoom: 1;
}

.layui-form-label {
	width: 150px;
}

.contract-box {
	width: 60%;
	margin-left: 1.14%;
}


</style>
<body>
	<div class="layui-fluid">
		<div class="layui-card">
			<div class="layui-tab-item layui-show">
				<div style="padding-top: 15px;">&nbsp;</div>
				<form class="layui-form" id="addInfo_form">

					<fieldset class="layui-elem-field layui-field-title fieldset"
						id="comprehensivePlanInfo">
						<legend class="layui-btn layui-legend"
							style="text-align: left; cursor: default;">会议室管理 ></legend>
						<div class="layui-form-item">
							<label class="layui-form-label"></label>
						</div>
						<div class="contract-box" id="meeting-node">
							<div class="contract-money">
								<table class="layui-table">
									<colgroup>
										<col width="90">
										<col width="300">
										<col width="300">
										<col width="300">
										<col width="250">
									</colgroup>
									<thead>
										<tr>
											<th>序号</th>
											<th>会议室名称</th>
											<th>容纳人数</th>
											<th></th>
										</tr>
									</thead>
									<tbody>
									</tbody>
								</table>
							</div>
						</div>
					</fieldset>

					<div class="layui-form-item"
						style="position: fixed ! important; right: 30px; bottom: 45%; z-index: 10000;">
						<div class="layui-input-block">
							<button
								class="layui-btn layui-bg-blue layui-btn-normal layui-btn-lg  layui-btn-radius"
								type="button" lay-submit lay-filter="addInfo_form_submit"
								id="addInfo_form_submit">
								<i class="layui-icon layui-icon-ok layuiadmin-button-btn"></i>确认提交
							</button>
						</div>
					</div>
				</form>
			</div>
		</div>
	</div>
	<script>
	String.prototype.format = function () {
		var model = arguments;
	    return this.replace(/\{(\d+)\}/g, function (s, i) { 
	        return !!model[i]?model[i]:'';
	    });
	}
	String.prototype.toInt = function () {
		if(this==''){
			return 0;
		}
		return parseInt(this);
	}
	
		var meetingNodeDataBind = function($) {
			var meetingNodeData = [ {
				roomName : '',
				holdNum : 0
			} ];
			var templateHtml = $('#meeting-tr').html();
			var $table = $('#meeting-node').find('tbody');
			$table.empty();
			$table.on('click','.add-row',function() {
						var $row = $(this).parents('tr');
						var rowId = parseInt($row.find('.label').text()) + 1;
						var meetingNodeTr = templateHtml.format(rowId, '', 0);
						var $newRow = $(meetingNodeTr);
						$row.after($newRow);
						var newIndex = $newRow.index();
						$table.find('tr:gt(' + newIndex + ')').each(function() {
									var $row = $(this);
									var rowId = parseInt($row.find('.label').text()) + 1;
									$row.find('.label').text(rowId).end().find('input[type=hidden]').val(rowId);
						});
			}).on('click','.del-row',function() {
				var $row = $(this).parents('tr');
				if ($table.find('tr').length == 1) {
					return layer.msg('至少需保留一个子项', {
						icon : 1
					});
				}
				layui.layer.confirm('确定删除？', {
					icon : 3,
					title : '提示'
				}, function(index) {
					var i = $row.index() - 1
					$table.find('tr:gt(' + i + ')').each(
							function() {
								var $row = $(this);
								var rowId = parseInt($row.find('.label').text()) - 1;
								$row.find('.label').text(rowId).end().find('input[type=hidden]').val(rowId);
							});
					$row.remove();
					layui.layer.close(index);
				});
			}).on('keyup','.holdNum',function() {
				var val2 = this.value.replace(/[^0-9.]/g, "");
				this.value = val2;
			});

			for (var i = 0, j = meetingNodeData.length; i < j; i++) {
				var html = [], rowId = i + 1;
				var item = meetingNodeData[i];
				var meetingNodeTr = templateHtml.format(rowId, item.roomName,item.holdNum);
				var $row = $(meetingNodeTr);
				if (i == 0) {
					$row.find('.del-row').remove();
				}
				$table.append($row);
			}
		}

		//删除文件
		function del(index) {
			layui.$("#fileAtt_" + index).remove();
			layui.$("#upload_img_" + index).remove();
		}

		//根据url查看文件
		function showImg(url) {
			var openWin = window
					.open(
							url,
							'',
							'left=410,height=768, width=1024, top=200,  toolbar=no, menubar=no, scrollbars=no, resizable=no,location=no, status=no');
		}

		//静态资源路径前缀
		var staticPath = '${fileHttpPre}';
		var stateJSON = <infopub:dicJson groupNo="A00010028" />;

		layui
				.config({
					base : '${ctx}/resources/layuiadmin/' //静态资源所在路径
				})
				.extend({
					index : 'lib/index' //主入口模块
				})
				.use(
						[ 'index', 'set', 'upload', 'element', 'laydate' ],
						function() {
							var $ = layui.$, form = layui.form, element = layui.element, laydate = layui.laydate, upload = layui.upload;
							form.verify({
										CHS : [ /^[\u0391-\uFFE5]+$/, '只能输入汉字' ],
										intNumber : [ /^[1-9]\d*$/, '请输入正确的数字' ],
										floatNumber : [
												/^([-]?)([0-9](\d+)?(\.\d{1,2})?$)|(^\d\.\d{1,2}$)/,
												'请输入正确的数字' ],
										floatAmount : [
												/^([1-9](\d+)?(\.\d{1,2})?$)|(^\d\.\d{1,2}$)/,
												'请输入正确的数字' ]
									});
							meetingNodeDataBind($)
							
							
							var uploadRender = function(id) {
								upload
										.render({
											elem : '#' + id + '-upload-more',
											url : basePath
													+ '/meetingRecord/uploadAtt/',
											data : {
												types : id
											},
											multiple : true,
											accept : 'file',
											acceptMime : 'application/zip,application/x-rar-compressed,image/jpeg,image/png,application/msword,application/vnd.openxmlformats-officedocument.wordprocessingml.document,application/vnd.ms-powerpoint,application/vnd.openxmlformats-officedocument.presentationml.presentation,application/vnd.ms-excel,application/vnd.openxmlformats-officedocument.spreadsheetml.sheet,application/pdf',
											before : function(obj) {
												layer.load();
											},
											done : function(res) {
												if (res.code > 0) {
													layer.closeAll('loading');
													return layer.msg(res.msg, {
														icon : 7
													});
												}
												if (res.entity != null
														&& res.entity.length > 0) {
													for ( var i in res.entity) {
														var meetingRecord = res.entity[i];
														var arr = meetingRecord
																.split("|");
														var imgSrc = "";
														var suffix = arr[1]
																.substring(
																		arr[1]
																				.lastIndexOf(".") + 1,
																		arr[1].length);
														if (suffix == 'jpg'
																|| suffix == 'png') {
															imgSrc = "${fileHttpPre}/"
																	+ arr[3];
														} else {
															imgSrc = "${ctx}/resources/images/"
																	+ suffix
																	+ ".jpg";
														}
														$(
																'#'
																		+ id
																		+ '-upload-more-list')
																.append(
																		'<div class="layui-upload-img-div" id="upload_img_'+arr[2]+'"><img src="'+imgSrc+'" title="'+ arr[1] +'" class="layui-upload-img"><div class="mask"><a href="javascript:void(0)" onclick="showImg(\''
																				+ "${fileHttpPre}"
																				+ arr[3]
																				+ '\');">查看</a><a href="javascript:void(0)" onclick="del(\''
																				+ arr[2]
																				+ '\')";>删除</a></div><p>'
																				+ arr[1]
																				+ '</p><input type="hidden" value="'+meetingRecord+'" id="fileAtt_'+arr[2]+'" name="fileAtts'+id+'" ></input></div>');
													}
												}
											},
											allDone : function(obj) {
												layer.closeAll('loading');
											},
											error : function() {
												layer.closeAll('loading');
												layer.msg("上传失败，请稍后再试~", {
													icon : 7
												});
											}
										});
							}
							for (var i = 1; i < 3; i++) {
								uploadRender(i);
							}
							//监听提交
						  	form.on('submit(addInfo_form_submit)', function(data){
						  		$("#addInfo_form_submit").removeAttr("lay-submit").removeClass("layui-bg-blue").addClass("layui-btn-disabled");
						  		layer.load();
						       	//提交 Ajax 成功后，静态更新表格中的数据      	
						       	$.ajax({
						           	type : 'post',
									url : basePath + '/meetingRecord/manage',
						           	data: $('#addInfo_form').serialize(),
									success:function(result){
										if(result.success){
											layer.closeAll('loading'); //关闭loading
											layer.msg('提交单据成功~',{icon: 1});
											//两秒后关闭当前页面
											setTimeout(function(){
												/**
												 * 查找父菜单，并刷新
												 */
												var topDoc = $(window.top.document);
												var path = basePath + '/meetingRecord/list';
												// 获取页面名称
												var name = topDoc.find(".layui-nav-item [lay-href^='" + path + "']").text();
												if(name == '' || name == null){
													name = '会议申请';
												}
												window.parent.layui.index.openTabsPage(path, name);
												var iframe = window.parent.layui.admin.tabsBody(window.parent.layui.admin.tabsPage.index).find(".layadmin-iframe");
												iframe[0].contentWindow.location.reload(true);
												
												/**
												 * 关闭当前页
												 */
												var currPath = basePath + '/meetingRecord/mgr';
												var layid = topDoc.find("li[lay-id^='" + currPath + "']").attr('lay-id');
												window.parent.layui.element.tabDelete('layadmin-layout-tabs', layid);//关闭当前页
										        }, 2000);
										}else{
											layer.closeAll('loading'); //关闭loading
						  					$("#addInfo_form_submit").removeClass("layui-btn-disabled").addClass("layui-bg-blue").attr("lay-submit","");
											layer.msg(result.msg,{icon: 7});
									  	}
									}
						       	});
						   	});  
						});
		//'请输入正确数字，且必须为正整数！'
		function isNumberAndFloat(str) {
			var $ = layui.$, form = layui.form
			if (str.value == '' || str.value == null) {
				return;
			}
			var rgx = /^[1-9]\d*$/;

			var boolrgx = rgx.test(str.value);// true 
			if (boolrgx) {
				return true;
			} else {
				str.value ='';
				layer.msg('请输入正确数字，且必须为正整数！');
				return false;
			}
		}
	</script>
</body>
</html>

